html,
body,
#app {
	height: 100%;
}

body {
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
	overflow: hidden;
}

.gpt-face-box {
	text-align: center;
	margin-top: 50px;

	.face-title {
		font-size: 1.5rem;
		font-weight: bold;
		padding: 10px;
	}

	.face-desc {
		font-size: 14px;
		padding: 10px;
	}

	.face-item-box{
		margin-top: 30px;
	}

	li.face-gpt-item {
		float: left;
		display: flex;
		align-items: center;
		padding: 17px 20px;
		border: var(--border-in-light);
		box-shadow: var(--card-shadow);
		border-radius: 7px;
		margin-right: 10px;
		width: 12em;
		transform: scale(1);
		margin-bottom: 7px;
		margin-top: 7px;
		cursor: pointer;
		transition: all .3s ease;
	}

	.item-icon {
		float: left;
		margin-right: 10px;
	}

	.face-desc {
		font-size: 14px;
		padding: 10px;
	}

	.dark:bg-item-black{
		background-color: red !important;
	}
}

